﻿@model PinBoardEditModel
@{
    Layout = null;
}
<style>
    .tile {
        cursor: default;
    }
</style>
<div class="modal-dialog modal-wide" tabindex="10">
    <form action="/Post/Edit" method="POST" id="editArticleForm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                <h4 class="modal-title tahomaFont">در حال ویرایش @Model.Title @Model.Pins.Count</h4>
            </div>
            <div class="modal-body tahomaFont">
                <input type="hidden" name="Id" value="@Model.Id" />
                @foreach (var item in this.Model.Pins)
                {
                    <div class="pinItem" style="max-width: 25%; display:inline-block; text-align:center;">
                        <div class="tile double-down bg-green" style="height:auto;cursor:default">
                            <div class="tile-body" style="margin-top: 0px;">
                                <img src="@Url.Content(item.Address.Path)" class="img-responsive" />
                            </div>

                            <div class="tile-object">

                                <div class="name">
                                    <p style="margin-left:auto; margin-right:auto;display:inline-block;cursor:pointer; width:100%;"
                                        class="deletePinButton" data-id="@item.Id">
                                        <i class="fa fa-trash-o"></i>
                                    </p>
                                    @item.Description
                                </div>

                            </div>
                        </div>
                    </div>
                }
            </div>
            <div class="modal-footer">
                <button type="button" class="btn default red" data-dismiss="modal">لغو</button>
                <input type="submit" class="btn green" id="saveEditedArticleButton" value="ثبت" />
            </div>
            <div>
                <hr />
            </div>
        </div>

    </form>

    @Html.Action("Create", "ImagePin", new { boardId = Model.Id })

</div>
<script>
    $('.tile-object .deletePinButton').click(function (e) {
        var parent = $(this).closest('.pinItem');
        var itemId = $(this).attr('data-id');
        $.ajax({
            type: 'post',
            url: '/ImagePin/Delete',
            data: { id: itemId },
            beforeSend: function(){
                $(parent).fadeOut('slow');
            },
            success: function (data) {
                toastrHelper.success('', 'انجام شد');
            },
            error: function () {
                toastrHelper.error('خطا');
                $(parent).fadeIn('fast');
            }
        })
    });

    $('body').on('hidden.bs.modal', '.modal', function () {
        $(this).removeData('bs.modal');
    });
</script>